import React from 'react';

import { connect } from 'react-redux';
import moment from 'moment'

class StepEnd extends React.Component {
	constructor(props){
		super(props)
		this.state = {
			endTime: this.props.userReducer.step.flowBaseInfo ? this.props.userReducer.step.flowBaseInfo.flowDate : '',
			stepId: this.props.userReducer.step.flowBaseInfo ? this.props.userReducer.step.flowBaseInfo.flowNumber : ''
		}
	}
	
	render() {
		return (
			<div className='finish-img' >
				<div className='finish-icon'>
					<img src={require('../image/finish_icon.png')} alt=''/>
				</div>
				<p>流程已结束，感谢您的参与</p>
				<div className='finish-time'>
					<div>
						<p className='finish-time-title' style={{marginBottom:'0.24rem'}}>结束时间</p>
						<p className='finish-time-title'>流程编号</p>
					</div>
					<div>
						<p className='finish-time-value' style={{marginBottom:'0.24rem'}}>
							{moment(this.state.endTime).format('YYYY-MM-DD HH:mm')}
						</p>
						<p className='finish-time-value' style={{width:'40vw'}}>
							{`${this.state.stepId}   `}
						</p>
					</div>
				</div>
				<div 
					id='closeBtn'
					className='endComfrieBtn'
					onTouchStart={()=>{document.getElementById('closeBtn').style.backgroundColor = '#D97442'}}
					onTouchEnd={()=>{document.getElementById('closeBtn').style.backgroundColor = '#FFA24A'}}
					onClick={()=>{
						window.dd.biz.navigation.close({
						    onSuccess : function(result) {
						        /*result结构
						        {}
						        */
						    },
						    onFail : function(err) {}
						})
					}}
					>
					关 闭
				</div>
			</div>
		);
	}
}


function mapStateToProps(state) {
  const { userReducer } = state;
  return {
    userReducer
  };
}

export default connect(mapStateToProps)(StepEnd);
